Estoy intentando agregar un detector de eventos al elemento del documento, que permanece activo solo mientras un elemento de sección específico está dentro de la parte visible de la ventana gráfica.

Este oyente escucha dos pulsaciones de teclas, ArrowLeft y ArrowRight , y llama a las funciones coincidentes moveLeft() y moveRight() para cada caso. Una vez que la sección ya no sea visible dentro de la ventana gráfica, se eliminará el eventListener.

 const cObserverHandler = entries => { const [entry] = entries; const keyListener = e => { if (e.key === 'ArrowLeft') moveLeft(); else if (e.key === 'ArrowRight') moveRight(); }; if (entry.isIntersecting) { console.log('intersect'); document.addEventListener('keyup', keyListener); } else if (!entry.isIntersecting) { console.log('depart'); document.removeEventListener('keyup', keyListener); } };

Para abreviar, excluí la configuración de IntersectionObserver y el funcionamiento de la aplicación más grande.

Además, para aquellos que aún no están familiarizados, dentro de este contexto, entry.isIntersecting se evaluará como un valor booleano en función de si la sección antes mencionada se encuentra dentro del área visible de la ventana gráfica.

Elproblema :

Examinando la consola, los mensajes 'se cruzan' y 'salen' se disparan durante mi prueba de desplazamiento en los momentos esperados. Sin embargo, algunas pruebas de estrés adicionales han demostrado que las pulsaciones de flecha se registran y actúan incluso después del punto en el que se debe eliminar al oyente. ¿Alguna idea de por qué podría ser esto?

Gracias por leer.